<template>
  <!-- // 用ref包裹完后，不用name.value，直接读取name，vue会自动加上.value。 -->
  <h1>{{name}}</h1>
  <button @click="say">say</button>
</template>

<script>
  import {ref} from 'vue'
  export default {
    name: 'App',
    setup(){
      // 用ref包裹成响应式
      let name = ref("zhangsan")
      let age = ref(18)
      function say(){
        // 用ref包裹完后，里面的value值改了，vue会检测到。
        name.value ="lisi"
        age.value = 99
        console.log('name', name,age)
      }
      return {
        name,
        say
      }
    },
  }
</script>
